<?xml version="1.0" encoding="UTF-8"?>
<ui:composition template="/pages/mastertemplate/MasterPage.xhtml"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:syn="http://www.syniverse.com">
	<ui:define name="content">
		<p:panel header="Nhận Dữ Liệu">
			<h:form id="receiveHD">
				<table>
					<tr>
						<td><p:outputLabel value="Chọn ngày Thực Xuất: " /></td>
						<td><p:calendar pattern="dd/MM/yyyy" id="ngayPhatHanh"
								required="true" showButtonPanel="true"
								value="#{ChiTietNXBean.ngayPhatHanhUpload}">
								<p:ajax event="dateSelect"
									listener="#{ChiTietNXBean.onDateSelect}" />
							</p:calendar></td>
					</tr>
					<tr>
						<td><p:outputLabel value="Nhập số Hóa Đơn: " /></td>
						<td><p:outputLabel value="Từ: " /> <p:inputText
								required="true" maxlength="30" id="soHDStart"
								value="#{ChiTietNXBean.soHDStart}">
								<p:ajax event="blur" listener="#{ChiTietNXBean.handlesoHDEvent}" />
							</p:inputText></td>
						<td><p:outputLabel value="Đến: " /></td>
						<td><p:inputText required="true" maxlength="30" id="soHDEnd"
								value="#{ChiTietNXBean.soHDEnd}">
								<p:ajax event="blur" listener="#{ChiTietNXBean.handlesoHDEvent}" />
							</p:inputText></td>
					</tr>
				</table>
			</h:form>
			<h:form id="uploadform">

				<p:fileUpload widgetVar="fileuplaod_wgt"
					fileUploadListener="#{ChiTietNXBean.handleFileUpload}"
					mode="advanced" dragDropSupport="false"
					update=":loadHD:dataTable :addPhieuNhapXuatForm"
					sizeLimit="10000000" fileLimit="10"
					allowTypes="/(\.|\/)(#{DataConfigBean.fileExtensionPattern})$/" />
			</h:form>
		</p:panel>

		<h:form id="loadHD">
				<table>
					<tr>
						<td><p:outputLabel value="Chọn ngày Thực Xuất: " /></td>
						<td><p:calendar pattern="dd/MM/yyyy" showButtonPanel="true"
								value="#{ChiTietNXBean.ngayThucXuat}">
							</p:calendar></td>
						<td><p:commandButton id="buttonClick" value="Lưu "
								action="#{ChiTietNXBean.LoadHD}"
								update="dataTable"/></td>

					</tr>
				</table>
			
			

			<p:dataTable styleClass="tableColoredPanel" id="dataTable"
				var="phieuNhapXuat" value="#{ChiTietNXBean.listChiTietNhapXuat}"
				paginator="true" rows="10"
				filteredValue="#{ChiTietNXBean.filteredPhieuNhapXuat}"
				currentPageReportTemplate="(Hiển thị {startRecord} - {endRecord} of 
       {totalRecords} hóa đơn)"
				paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
				rowsPerPageTemplate="10,20,50,100" widgetVar="dataTableForm"
				style="width: 100%; margin: 45px auto;">


				<f:facet name="header">
					<h:outputText value="Danh Sách Hóa Đơn Xuất Kho"
						styleClass="tableHeader" />
					<div style="margin: -4px -11px 5px; float: right;">
						<p:commandButton style="height: 25px"
							actionListener="#{ChiTietNXBean.notifyAdd}"
							update=":addPhieuNhapXuatForm:display" value="Thêm mới"
							rendered="#{UserBean.getAccessLevel() == 'WRITE'}"
							onclick="PF('phieuNhapXuatDialog').show();">
							<p:resetInput target=":addPhieuNhapXuatForm:display" />
						</p:commandButton>
					</div>

				</f:facet>
				<p:column headerText="STT" width="5%" style="text-align:center"
					sortBy="#{phieuNhapXuat.STT}">#{phieuNhapXuat.STT}  </p:column>
				<p:column headerText="Số Hóa Đơn"
					filterBy="#{phieuNhapXuat.soHoaDon}" width="10%"
					style="text-align:center" filterMatchMode="contains"
					sortBy="#{phieuNhapXuat.soHoaDon}">#{phieuNhapXuat.soHoaDon}  </p:column>


				<p:column headerText="Đơn Hàng" filterBy="#{phieuNhapXuat.donHang}"
					width="9%" style="text-align:center" filterMatchMode="contains"
					sortBy="#{phieuNhapXuat.donHang}">#{phieuNhapXuat.donHang}  </p:column>
				<p:column headerText="Ngày Phát Hành" width="12%"
					style="text-align:center" filterBy="#{phieuNhapXuat.ngayPhatHanh}"
					filterMatchMode="contains" sortBy="#{phieuNhapXuat.ngayPhatHanh}">
					<h:outputText value="#{phieuNhapXuat.ngayPhatHanh}">
						<f:convertDateTime pattern="dd/MM/yyyy " />
					</h:outputText>
				</p:column>
				<p:column headerText="Số Xe" filterBy="#{phieuNhapXuat.soXe}"
					width="10%" style="text-align:center" filterMatchMode="contains"
					sortBy="#{phieuNhapXuat.soXe}">#{phieuNhapXuat.soXe}  </p:column>
				<p:column headerText="Tài Xế" width="10%" style="text-align:center"
					filterBy="#{phieuNhapXuat.nguoiNhan}" filterMatchMode="contains"
					sortBy="#{phieuNhapXuat.nguoiNhan}">#{phieuNhapXuat.nguoiNhan}  </p:column>
				<p:column headerText="Ngày Thực Xuất" width="12%"
					style="text-align:center" filterBy="#{phieuNhapXuat.ngayThucXuat}"
					filterMatchMode="contains" sortBy="#{phieuNhapXuat.ngayThucXuat}">
					<p:outputLabel value="#{phieuNhapXuat.ngayThucXuat}">
						<f:convertDateTime pattern="dd/MM/yyyy " />
					</p:outputLabel>
				</p:column>
				<p:column headerText="Giờ Thực Xuất" width="12%"
					style="text-align:center" filterBy="#{phieuNhapXuat.gioThucXuat}"
					filterMatchMode="contains" sortBy="#{phieuNhapXuat.gioThucXuat}">
					<p:outputLabel value="#{phieuNhapXuat.gioThucXuat}">
						<f:convertDateTime pattern="HH:mm " />
					</p:outputLabel>
				</p:column>
				<p:column headerText="SL Thực Xuất" width="10%"
					style="text-align:center" filterBy="#{phieuNhapXuat.soluongTX}"
					filterMatchMode="contains" sortBy="#{phieuNhapXuat.soluongTX}">
					<h:outputText value="#{phieuNhapXuat.soluongTX}">
						<f:convertNumber minIntegerDigits="1" />
					</h:outputText>
				</p:column>
				<p:column headerText="Công Cụ" width="10%" style="text-align:center">
					<p:commandButton style="margin-left: 5px" styleClass="smallButton"
						id="editgroup" actionListener="#{ChiTietNXBean.selectPNX(phieuNhapXuat)}"
						update=":addPhieuNhapXuatForm:display :loadHD"
						icon="ui-icon ui-icon-pencil"
						onclick="PF('phieuNhapXuatDialog').show();">
						<p:resetInput target=":addPhieuNhapXuatForm:display" />
					</p:commandButton>
				</p:column>
			</p:dataTable>

		</h:form>
		<h:form id="addPhieuNhapXuatForm">
			<p:growl id="addPhieuNhapXuatFormMessage" autoupdate="true"
				life="#{DataConfigBean.growlShow}" />
			<p:dialog id="dialog" header="Thêm mới/Sửa" modal="true"
				widgetVar="phieuNhapXuatDialog" resizable="false">

				<p:panel id="display" mode="native" style="width:300px;height:300px">
					<table>
					<tr>
							<td><p:outputLabel value="STT: " /></td>
							<td><p:inputText required="true" maxlength="30"
									id="stt"
									value="#{ChiTietNXBean.addChiTietNhapXuat.STT}">

								</p:inputText></td>
						</tr>
						<tr>
							<td><p:outputLabel value="Số Hóa Đơn: " /></td>
							<td><p:inputText required="true" maxlength="30"
									id="soHoaDon"
									value="#{ChiTietNXBean.addChiTietNhapXuat.soHoaDon}">

								</p:inputText></td>
						</tr>
						<tr>
							<td><p:outputLabel value="Đơn Hàng: " /></td>
							<td><p:inputText maxlength="30" id="donHang"
									value="#{ChiTietNXBean.addChiTietNhapXuat.donHang}">

								</p:inputText></td>
						</tr>
						<tr>
							<td><p:outputLabel value="Ngày Phát Hành: " /></td>
							<td><p:calendar pattern="dd/MM/yyyy" id="ngayPhatHanh"
									required="true" showButtonPanel="true"
									value="#{ChiTietNXBean.addChiTietNhapXuat.ngayPhatHanh}">

								</p:calendar></td>
						</tr>

						<tr>
							<td><p:outputLabel value="Số Xe: " /></td>
							<td><p:inputText maxlength="30" id="soXe"
									value="#{ChiTietNXBean.addChiTietNhapXuat.soXe}">

								</p:inputText></td>
						</tr>
						<tr>
							<td><p:outputLabel value="Tên Tài Xế: " /></td>
							<td><p:inputText maxlength="30" id="nguoiNhan"
									value="#{ChiTietNXBean.addChiTietNhapXuat.nguoiNhan}">

								</p:inputText></td>
						</tr>
						<tr>
							<td><p:outputLabel value="Ngày Thực Xuất " /></td>
							<td><p:calendar pattern="dd/MM/yyyy" id="ngayThucXuat"
									required="true" showButtonPanel="true"
									value="#{ChiTietNXBean.addChiTietNhapXuat.ngayThucXuat}"
									styleClass="popupButtonCal">

								</p:calendar></td>
						</tr>
						<tr>
							<td><p:outputLabel value="Giờ Thực Xuất: " /></td>
							<td><p:calendar pattern="HH:mm" id="gioThucXuat"
									required="true" showButtonPanel="true"
									value="#{ChiTietNXBean.addChiTietNhapXuat.gioThucXuat}"
									styleClass="popupButtonCal" timeOnly="true">

								</p:calendar></td>
						</tr>
						<tr>
							<td><p:outputLabel value="Số Lượng Thực Xuất: " /></td>
							<td><p:inputText maxlength="30" id="soluongTX"
									value="#{ChiTietNXBean.addChiTietNhapXuat.soluongTX}">

								</p:inputText></td>
						</tr>
						<tr>
							<td><p:commandButton id="buttonClick" value="Lưu "
									action="#{ChiTietNXBean.addCTNX}"
									update=":loadHD"
									oncomplete="if(args.opSuccess){ PF('phieuNhapXuatDialog').hide() ;PF('dataTableForm').filter()};" /></td>
							<td></td>

						</tr>
					</table>

				</p:panel>

			</p:dialog>
		</h:form>
	</ui:define>
</ui:composition>
